<template>
  <div>

	<myheader></myheader>
	

	<section class="featured-block text-center">
		<div class="container">
			
			<Breadcrumb :datas='datas'></Breadcrumb>
			<form>
			<ul>
				<li v-for="(item,index) in data" :key="index" style="text-align:left;">
						<div>
							<router-link :to="{path:'/item',query:{gid:item.id}}">
							<img :src="adminurl + '/static/upload/' + item.img" width="100px">
							{{item.name}}
							</router-link>

						</div>
				</li>
			</ul>  
			<div v-width="300"><AutoComplete :option="param" v-model="value" @change="onChange" type="title"></AutoComplete></div>
			<br><br><br>
			
			<h6 v-if="isdata == ''">未搜索到该商品</h6>
			</form>


		</div>
	</section>
	

	<myfooner></myfooner>

  </div>
  
</template>


 
<script>
import myheader from './myheader'
import myfooner from './myfooner'
import {config} from '../config'

import jsonp from 'fetch-jsonp';

const loadData = function (filter, callback) {
  // this 为 option 配置
  // this.orgId 使用传递的参数获取数据，例：搜索某公司下的员工
  jsonp(`https://suggest.taobao.com/sug?code=utf-8&q=${filter}`)
    .then(response => response.json())
    .then((d) => {
      callback(d.result.map((r) => {
        return r[0];
      }));
    });
};

export default {
  data () {
    return {
	  msg: "这是一个变量",
		//   面包屑导航
		datas:[{title:"首页",route:{name:"index"}},{title:"搜索结果"}],
		work:this.$route.query.work,
		adminurl:config["adminurl"],
		data:[],
		isdata:"",

		value: '测试',
      param: {
        orgId: 1, // 自定义参数传递
        loadData,
        minWord: 1
      }
    }
  },
  components:{
	  "myheader":myheader,
	  "myfooner":myfooner

  },
  mounted:function(){
		this.getgoods()
  
},
  methods:{ 
		onChange(data, trigger) {
      console.log(data, trigger);
    },
		getgoods(){
			if(this.work == ""){
				this.$Message('参数错误')
				return false
			}
			this.axios.get(this.adminurl + '/goodsearch/',{params:{work:this.work}}).then(res=>{
				this.data = res.data
				this.isdata = res.data.length
		  })
		},

		 
		 
  }
}


</script>
 
<style>



</style>